var _input_labels = {
      sgi: 'Search for interactions between given genes and their first neighbors'
    , rsgi: 'Search for genetic interactions strictly within given genes'
    , sgibb: 'Search genetic interactions in biclustering background'
    , cgipg: 'Cluster genetic interaction profiles'
    , etg: 'Enrichment test for genes'
};

var _inav_pics = {
      sgi: '../inc/images/pic1.png'
    , rsgi: '../inc/images/pic2.png'
    , sgibb: '../inc/images/pic3.png'
    , cgipg: '../inc/images/pic4.png'
    , etg: ''
};

var _inav_desc = {
      sgi: '"Search Genetic Interaction" will search ALL genetic interactions between given genes and their first neighbors in genetic interaction network.<br />Please see the example, red nodes are user search genes. The edges are genetic interactions.'
    , rsgi: '"Restricted Search Genetic Interaction" will search genetic interactions strictly within given genes.<br />In the example, red nodes are user search genes. The edges are genetic interactions.'
    , sgibb: '"Search Genetic Interaction in biclustering background" will search genetic interaction biclusters which contain genetic interactions of user search genes.<br/>In the example, user submit two genes (in red nodes), SGACellMap will find a bicluster containing these two genes. For details, please refer to J Bellay et al. Genome Research 2012'
    , cgipg: '"Cluster genetic interaction profiles" will perform hierarchical clustering analysis on our whole genome genetic interaction data, given user submission of list of genes of interests and visualize result in heatmap style.'
    , etg: '"Enrichment test for genes" use different annotation resources (gene ontology, KEGG, protein structure, and disease ontology) to analyze enrichments of user defined gene sets in our genetic interaction network background.'
};

var _ic_link_pics = {
      igi: '../inc/images/pic5.png'
    , ack: '../inc/images/pic6.png'
    , cf: '../inc/images/pic6.png'
};

$(function(){
    $('#i_nav #sgi').addClass('active');
    $('#i_nav .i_tab').live('click', function(e){
        var tab_id = $(e.target).closest('.i_tab').attr('id');
        $('#i_nav').find('.active').removeClass('active');
        $('#i_nav #' + tab_id).addClass('active');
        var html = '';
        $('#i_contact .ic_link').css('text-decoration', 'none');
        if ($('#i_content .dc').length > 0){
            $('#i_content .dc').remove();
        }
        if ($('#i_content .ic').length > 0){
            $('#i_content .ic').remove();
        }
        if ($('#i_content #video_info').length > 0){
            $('#i_content #video_info').hide();
        }
        
        if (tab_id == 'vinfo'){
            if ($('#i_content #video_info').length > 0){
                $('#i_content #video_info').show();
            } else {
                html += '<div id="video_info">' 
                    + '<iframe width="480" height="360" src="http://www.youtube.com/embed/H2GEzH5kcsY" frameborder="0" allowfullscreen></iframe>' 
                    + '</div>';
                $('#i_content').append(html);
            }
        }else {
            html += '<div class="dc" id="content">' 
                + '<form id="searchForm" name="searchForm" method="post" action="' + (tab_id == 'sgibb' ? 'block.php' : 'result.php') + '" enctype="multipart/form-data">'
                + '<div id="seacher" class="seacher">'
                + '<input id="query_type" type="hidden" name="query_type" value="' + (tab_id == 'sgi' ? 'with' : (tab_id == 'sgibb' ? 'enrich' : 'within')) +'">'
                + '<input id="it" class="i_inputtext" name="geneNames" type="text" /><input class="ibs" id="ibs" type="submit" value="GO" />'
                + '</div>';
            if (tab_id != 'sgibb'){
                html += '<div id="helper" class="helper">'
                    + '<p><a href="javascript:void(0)" class="upload">Upload gene list</a></p>'
                    + '<p><a href="javascript:void(0)" class="params">Set Search Parameters</a></p>'
                    + '</div>' 
                    + '<div id="box" class="box" style="display: none">' 
                    + '<table>' 
                    + '<tr><td>Negative interactions:SGA score&lt;=</td><td><input type="text" class="e_neg" name="e_neg"/></td></tr>' 
                    + '<tr><td>with p-value &lt;=</td><td><input type="text" class="p_neg" name="p_neg" /></td></tr>' 
                    + '<tr><td>Positive interactions:SGA score&gt;=</td><td><input type="text" class="e_pos" name="e_pos" /></td></tr>' 
                    + '<tr><td>with p-value &lt;=</td><td><input type="text" class="p_pos" name="p_pos" /></td></tr>' 
                    + '</table>' 
                    + '<p><input type="radio" name="rvalue" value="significant" checked="checked" />Significant genetic interaction profile correlations (|r| > 0.1)</p>' 
                    + '<p><input type="radio" name="rvalue" value="notsignificant" />Not significant genetic interaction profile correlations</p>' 
                    + '</div>';
            }
            html += '<div class="pannel">'
                + '<img src="' + _inav_pics[tab_id] + '" />'
                + '<p>' + _inav_desc[tab_id] + '</p>'
                + '</div></form></div>';
            $('#i_content').append(html);
            $("#it").inputLabel(_input_labels[tab_id], {color:'0xFFF'});

            $(".e_neg").inputLabel('-0.08', {color:'0xFFF'});
            $(".p_neg").inputLabel('0.05', {color:'0xFFF'});
            $(".e_pos").inputLabel('0.08', {color:'0xFFF'});
            $(".p_pos").inputLabel('0.05', {color:'0xFFF'});
        
            $('#it').autocomplete(names, {
                matchContains: true,
                multiple: true,
                max: 100,
                formatItem: function(row, i, max) {
                    if ($('#query_type').val() == 'with'){
                        if (row.v == 0) return row.k;
                        else return false;
                    } else if ($('#query_type').val() == 'enrich'){
                        if (row.v == 2) return row.k;
                        else return false;
                    } else if ($('#query_type').val() == 'within'){
                        if (row.v == 0 || row.v == 1) return row.k;
                        else return false;
                    }
                    return row.k;
                },
                formatMatch: function(row, i, max) {
                    return row.k + " " + row.v;
                },
                formatResult: function(row) {
                    return row.k;
                }
            });
        }
    });
    $('#i_nav #sgi').trigger('click');
    $('.helper .upload').live('click', function(e){
        if ($(e.target).closest('.helper').find('.upfile').length > 0){
            $(e.target).closest('.helper').find('.upfile').remove();
            $(e.target).closest('.helper').find('#subup').remove();
        } else {
            var html = '<input name="file" type="file" class="upfile" id="upfile" />';
            $(e.target).after(html);
        }
    });
    
    $('.helper .params').live('click', function(e){
        $('.dc #box').slideToggle('slow');
    });
    
    $('#i_contact .ic_link').live('click', function(e){
        var id = $(e.target).attr('id');
        var html = '';
        $('#i_nav').find('.active').removeClass('active');
        if ($('#i_content .dc').length > 0){
            $('#i_content .dc').remove();
        }
        if ($('#i_content .ic').length > 0){
            $('#i_content .ic').remove();
        }
        $('#i_contact .ic_link').css('text-decoration', 'none');
        $('#i_contact #' + id).css('text-decoration', 'underline');
        if (id == 'igi'){
            html += '<div class="ic"><div class="ic_msg_' + id + '">'
            + '<p>The SGACellMap portal is dedicated to providing query, analysis and visualization of genome scale yeast genetic interaction in network context.</p>'
            + '<p>Genetic interaction<br/>'
            + 'A genetic interaction refers to an unexpected phenotype not easily explained by combining the effects of individual genetic variants. '
            + 'For example, in the case where cell fitness is the phenotype of choice, a digenic interaction is identified when a double mutant shows a significant deviation in fitness compared to the expected fitness associated with the combination of the two single mutant phenotypes.'
            + 'Negative genetic interactions refer to a more severe fitness defect than expected, with the extreme case being synthetic lethality. Positive genetic interactions refer to double mutants with a less severe fitness defect than expected'
            + '</p>'
            + '<p>Genetic interaction network<br/>' 
            + 'The advance of Synthetic genetic array technology allows a high through-put measurement of genetic interaction and provide the glimpse of a quantitative genome-scale genetic interaction network for a eukaryotic cell. The global genetic interaction network is highly informative for deciphering the underlying functional principles that govern how genes control cell processes. This site contains pairwise of genetic interactions between 5000 yeast genes.'
            + '</p>'
            + '</div><div class="ic_pic_'+ id + '"><img src="' + _ic_link_pics[id] + '"/></div></div>';
        } else if (id == 'ack' || id == 'cf'){
            html += '<div class="ic">'
            + '<div class="ic_pic_'+ id + '"><img src="' + _ic_link_pics[id] + '"/></div>'
            + '<div class="ic_msg_' + id + '">'
            + "<p>The genetic interaction network is mapped by SGA technology at Boone's lab at The Donnelly Centre for Cellular and Biomolecular Research, at University of Toronto, Canada</p>"
            + "<p>This portal is developed by Myers' lab at University of Minnesota, Twin cities, MN, USA and Huazhong University of Science and Technology, Wuhan, China</p>"
            + '<p>Contact: <a class="ic_mail" href="mailto:tianxia@northwestern.edu">Tian Xia</a> <a class="ic_mail" href="mailto:cmyers@cs.umn.edu">Chad Myers</a></p>'
            +'</div>'
            +'</div>';
        }
        
        $('#i_content').append(html);
    });
    
    $('#ibs').live('click', function(e){
        $('#searchForm').submit();
    });
});